const useComponentList = () => {
  const componentList = [
    {
      type: 'title',
      id: 'title',
      label: '标题',
      field: 'title',
      value: '标题',
      icon: 'Finished',
      props: {
        value: '标题',
        tag: 'h1',
        lineHeight: 1.6,
      },
    },
    {
      type: 'text',
      label: '文本',
      field: 'text',
      icon: 'Comment',
      id: 'text',
      props: {
        value: '文本',
        tag: 'span',
      },
    },
    {
      type: 'divider',
      label: '分割线',
      field: 'divider',
      icon: 'SemiSelect',
      props: {
        value: '分割线',
      },
    },
    {
      type: 'input',
      label: '输入框',
      field: 'input',
      value: '',
      icon: 'Edit',
      props: {
        placeholder: '请输入',
      },
      formItemProps: {},
    },
    {
      type: 'inputNumber',
      label: '数字输入框',
      field: 'inputNumber',
      icon: 'DocumentAdd',
      props: {
        step: 1,
        min: 0,
        max: 10,
        precision: 1,
      },
      formItemProps: {},
    },
    {
      type: 'radio',
      label: '单选按钮',
      field: 'radio',
      value: '',
      icon: 'CircleCheckFilled',
      props: {},
      dataSource: {
        type: 'local',
        data: [
          { value: 'song', label: '唱' },
          { value: 'dance', label: '跳' },
          { value: 'rap', label: 'rap' },
          { value: 'ball', label: '篮球' },
        ],
      },
      formItemProps: {
        rules: [{ required: true, message: '必填' }],
      },
    },
    {
      type: 'checkbox',
      label: '多选框',
      field: 'checkbox',
      value: [],
      icon: 'Checked',
      props: {},
      dataSource: {
        type: 'local',
        // 本地数据源
        data: [
          { value: 'song', label: '唱' },
          { value: 'dance', label: '跳' },
          { value: 'rap', label: 'rap' },
          { value: 'ball', label: '篮球' },
        ],
        // 远程数据源
        url: '',
        method: '',
        params: [],
        resultKey: '',
      },
      formItemProps: {},
    },
    {
      type: 'select',
      label: '下拉框',
      field: 'select',
      value: '',
      icon: 'TakeawayBox',
      props: {},
      dataSource: {
        type: 'local',
        data: [
          { value: 'song', label: '唱' },
          { value: 'dance', label: '跳' },
          { value: 'rap', label: 'rap' },
          { value: 'ball', label: '篮球' },
        ],
      },
      formItemProps: {},
    },
    {
      type: 'switch',
      label: '开关',
      field: 'switch',
      value: false,
      icon: 'Open',
      props: {},
      formItemProps: {
        rules: [
          {
            validator: (value, callback) => {
              if (!value) callback('必选')
            },
          },
        ],
      },
    },
    {
      type: 'datePicker',
      label: '日期选择器',
      field: 'datePicker',
      value: '',
      icon: 'Calendar',
      props: {
        type: 'date',
      },
      formItemProps: {},
    },
    {
      type: 'timePicker',
      label: '时间选择器',
      field: 'timePicker',
      value: '',
      icon: 'AlarmClock',
      props: {
        type: 'time',
      },
      formItemProps: {},
    },
    // {
    //   type: 'timeSelect',
    //   label: '时间选择框',
    //   field: 'timeSelect',
    //   value: '',
    //   icon: 'Watch',
    //   props: {
    //     placeholder: '选择时间',
    //     start: '08:30',
    //     end: '18:30',
    //     step: '00:30',
    //   },
    //   formItemProps: {},
    // },
    {
      type: 'cascader',
      label: '级联选择器',
      field: 'cascader',
      value: [],
      icon: 'Operation',
      props: {
        placeholder: '请选择',
        options: [
          {
            value: 'gd',
            label: '广东省',
            children: [
              {
                value: 'sz',
                label: '深圳市',
              },
              {
                value: 'gz',
                label: '广州市',
              },
            ],
          },
          {
            value: 'gx',
            label: '广西省',
            children: [
              {
                value: 'nj',
                label: '南宁市',
              },
              {
                value: 'hz',
                label: '贺州市',
              },
            ],
          },
        ],
        props: {
          expandTrigger: 'click',
        },
      },
      formItemProps: {},
    },
    {
      type: 'colorPicker',
      label: '颜色选择器',
      field: 'colorPicker',
      value: '',
      icon: 'Brush',
      props: {
        showAlpha: true,
        predefine: [
          '#ff4500',
          '#ff8c00',
          '#ffd700',
          '#90ee90',
          '#00ced1',
          '#1e90ff',
          '#c71585',
          'rgba(255, 69, 0, 0.68)',
          'rgb(255, 120, 0)',
          'hsv(51, 100, 98)',
          'hsva(120, 40, 94, 0.5)',
          'hsl(181, 100%, 37%)',
          'hsla(209, 100%, 56%, 0.73)',
          '#c7158577',
        ],
      },
      formItemProps: {},
    },
  ]
  return { componentList }
}

export default useComponentList
